<template>
	<view class="goods-list">
		<view class="goods-item" v-for="item,index in list" :key="index">
			<image src="../../static/logo.png" mode="" class="img"></image>
			<view class="goods0-name">
				{{item.goods_name}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				queryInfo:{
					query:'',//关键字
					cid:'',//分类id
					pagenum:1,//当前页
					pagesize:10,//一页多少条
				},
				list:[],
				total:0,//总条数
				isLoading:false,//判断是否在请求中
			};
		},
		onLoad() {
			this.getList()
		},
		methods:{
			getList(type){
				this.isLoading = true 
				uni.showLoading({
					title:'加载中...'
				})
				uni.request({
					url:"https://api-hmugo-web.itheima.net/api/public/v1/goods/search",
					data:this.queryInfo,
					success: (res) => {
						
						if(type){
							type()
							this.list =res.data.message.goods 
						}else{
							// this.list = res.data.message.goods
							// 把所有页的数据累加在一起
							this.list = [...this.list,...res.data.message.goods]
						}
						// console.log(res);
						
						this.total = res.data.message.total
						
						this.isLoading = false
						uni.hideLoading()
					}
				})
			}
		},
		// 钩子函数  上拉触底
		onReachBottom() {
			console.log('触底了');
			if(this.total>this.list.length){
				if(!this.isLoading){
					this.queryInfo.pagenum++
					this.getList()
				}
			}else{
				uni.showToast({
					title:"没有更多数据了..."
				})
			}
			
			
		},
		// 下拉更新  更多的数据
		onPullDownRefresh() {
			console.log('下拉更新');
			this.queryInfo.pagenum = 1
			this.getList(()=>{
				uni.stopPullDownRefresh()
			})
		}
		
	}
</script>

<style lang="scss">
.goods-list{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	.goods-item{
		width: 50%;
		.img{
			width: 100%;
			height: 150px;
		}
	}
}
</style>
